{% extends "_layouts/examples.html" %}
{% block title %}Buttons / Alignment{% endblock %}

{% block standalone_css %}patterns_buttons{% endblock %}

{% block content %}
<p>
  <button>Classless button</button>
  <button>Classless button</button>
</p>

<p>
  <button class="p-button">Default button</button>
  <button class="p-button--positive">Positive button</button>
  <button class="p-button--negative">Negative button</button>
</p>

<p>
  <a href="#" class="p-button">Default link</a>
  <a href="#" class="p-button--positive">Positive link</a>
  <a href="#" class="p-button--negative">Negative link</a>
</p>

<p>
  <button>Classless button</button>
  <button class="p-button--positive">Positive button</button>
  <a href="#" class="p-button">Default link</a>
  <button class="u-hide">Hidden button</button>
  <button class="p-button--negative">Negative button</button>
</p>
{% endblock %}
